<template>
  <div>
    <el-tabs v-model="activeName">
      <el-tab-pane label="举报管理" name="tipOff">
        <el-table
            :data="tipOffList"
            style="width: 100%">
          <el-table-column
              prop="title"
              label="标题"
          >
          </el-table-column>
          <el-table-column
              prop="blogId"
              label="博客id"
          >
          </el-table-column>
          <el-table-column
              label="封面"
          >
            <template slot-scope="scope">
              <el-image
                  fit="fill"
                  :src="scope.row.cover"
                  style="width: 100px;"
              ></el-image>
            </template>
          </el-table-column>

          <el-table-column
              prop="description"
              label="简介"
          >
          </el-table-column>
          <el-table-column
              label="举报内容"
          >
            <template slot-scope="scope">
              {{ scope.row.reason }}
            </template>
          </el-table-column>
          <el-table-column
              label="操作"
          >
            <template slot-scope="scope">
              <el-button type="primary" @click="goBlogDetail(scope.row)">查看</el-button>
              <el-button type="danger" @click="rejectedTip(scope.row)">忽略</el-button>
              <el-button type="success" @click="rejectedBlog(scope.row)">同意</el-button>
            </template>
          </el-table-column>
        </el-table>
        <div style="display: flex;justify-content: center;margin-top: 20px;">
          <el-pagination
              layout="prev, pager, next"
              :total="tipOffTotalNum"
              :page-size="searchTipOffParams.limit"
              @current-change="handleTipOffCurrentChange"
          >
          </el-pagination>
        </div>
      </el-tab-pane>
    </el-tabs>
  </div>
</template>

<script>
import TipOffService from "@/service/TipOffService";

export default {
  name:"TipOff",
  data(){
    return {
      activeName:"tipOff",
      tipOffList:[],
      tipOffTotalNum:0,
      searchTipOffParams:{
        limit:10,
        offset: 0
      }
    }
  },
  created() {
    this.getTipOffList()
  },
  methods:{
    getTipOffList(){
      TipOffService.tipOffList(this.searchTipOffParams).then(rs => {
        this.tipOffTotalNum = rs.data.data.tipOffTotalNum;
        this.tipOffList = rs.data.data.tipOffList;
      })
    },
    rejectedTip(row){
      this.$confirm('忽略举报后将会删除举报的信息, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        TipOffService.overtipOff(row._id).then(rs => {
          if (rs.status === 200){
            this.getTipOffList()
            this.$message({
              type: 'success',
              message: '举报已删除!'
            });
          }
        })
      }).catch(() => {
      });

    },

    rejectedBlog(row) {
      this.$confirm('此操作将永久删除该文章, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        TipOffService.agreetipOff(row._id).then(rs => {
          if (rs.status === 200) {
            this.$message.success('删除成功');
            this.getTipOffList();
          }
        })
      }).catch(() => {

      });

    },
    //分页
    handleTipOffCurrentChange(page){
      this.searchTipOffParams.offset = (page - 1) * this.searchTipOffParams.limit;
      this.getTipOffList();
    },
    goBlogDetail(row){
      this.$router.push(`/article/${row.blogId}`)
    }
  }
}
</script>

<style>

</style>